<template>
	<view>
		<cu-custom bgColor="bg-gradual-pink" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">授权设备</block>
		</cu-custom>

		<view class="cu-bar margin-top bg-white solid-bottom">
			<view class="action">
				<text class="cuIcon-title text-blue"></text>已选
			</view>
		</view>

		<view class="padding flex flex-wrap justify-between align-center bg-white" style="justify-content:left">
			<view v-for="(item,index) in names" :key="index">
				<button class="cu-btn round">{{item}}</button>


			</view>





		</view>
		<view v-if="comp" class="cu-form-group margin-top">
			<view class="title">授权公司</view>
			<picker @change="PickerChange" :value="index" :range="picker" range-key="typename">
				<view class="picker">
					{{index>-1?picker[index].typename:'请选择授权公司'}}
				</view>
			</picker>
		</view>

		<!-- <view class="cu-form-group margin-top">
			<view class="title"   >已选:</view>
			<text style="position: fixed;left: 20%;">打法</text>
			
			
		</view> -->
		<view class="cu-form-group margin-top">
			<textarea v-model="sndata" @input="textareaAInput" placeholder="请输入设备序列号(多个以,号隔开)"></textarea>
		</view>

		<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white">
					<view class="action text-green" @tap="saveorder">确定</view>
					<view class="action text-blue" @tap="hideModal">取消</view>
				</view>
				<view class="padding-xl">
					你提交了{{snnum}}台设备
				</view>
			</view>
		</view>


		<view class="cu-modal" :class="modalName=='Modal'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">提示</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl">
					{{mes}}
				</view>
			</view>
		</view>

		<view class="padding flex flex-direction">

			<button class="cu-btn bg-blue margin-tb-sm lg" @click="saveauthinfo">提交</button>
		</view>

	</view>
</template>

<script>
	export default {

		data() {
			return {
				sndata: null,
				names: [],
				modalName: null,
				snnum: 0,
				total: 0,
				authlise: [],
				mes: '',
				isdj: true,
				index: -1,
				picker: [{
					name: '喵喵喵',
					key: "fdsa"
				}, {
					name: '汪汪汪',
					key: "fdsa1"
				}],
				typeid: 1,
				comp: true

			}
		},
		onLoad(option) {
			console.log('onload,', option)
			if (getApp().globalData.departid != '402880f0783f331501784302f77d00a5') {
				this.comp = false
				this.typeid = getApp().globalData.departid
			} else {
				this.Getcompany();
			}
			if (getApp().globalData.type == 'inside') {
				this.checkUserInfo();
			}


			console.log(option.authlist);

			this.authlise = JSON.parse(option.authlist)

			for (var i = 0; i < this.authlise.length; i++) {

				this.names.push(this.authlise[i].value);


			}

			console.log(this.names);



		},

		methods: {
			Getcompany() {
				//获取授权公司字典
				uni.request({
					url: this.$constant.BASEURL + this.$constant.GET_apiauthcompany,
					method: "POST",
					data: {
						username: getApp().globalData.username,
						token: getApp().globalData.token,
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					complete: (res) => {
						console.log(res.data)
						if (res.data.code == 0) {
							this.picker = res.data.data;

						} else if (res.data.code == 500) {
							uni.showToast({
								title: res.data.message,
								icon: 'none',
							})
							setTimeout(function() {
								uni.reLaunch({
									url: '/pages/login/login'
								})
							}, 2000)

						}


					}
				});
			},
			PickerChange(e) {
				console.log(this.picker[e.detail.value].id);
				this.typeid = this.picker[e.detail.value].id;
				this.index = e.detail.value
			},

			textareaAInput(e) {
				console.log(this.sndata);
			},
			checkUserInfo() {
				var that = this
				uni.getStorage({
					key: 'userinfo',
					success: function(res) {},
					fail() {
						uni.navigateTo({
							url: '/pages/login/login'
						})
					}
				})
			},
			saveauthinfo() {


				let reg = new RegExp('，', 'g') //g代表全部

				this.sndata = this.sndata.replace(reg, ',');

				var sns = this.sndata.split(',');

				var regex = /^\S{6}-\S{6}-\S{6}$/;

				var istj = true;

				for (var i = 0; i < sns.length; i++) {

					if (!regex.test(sns[i])) {
						uni.showModal({
							title: "提示",
							content: "序列号格式错误" + sns[i],
						});
						istj = false;
						break;

					}


				}
				if (this.index < 0 && this.comp) {
					uni.showModal({
						title: "提示",
						content: "请选择授权公司",
					});
					istj = false;

				}

				if (istj) {
					this.snnum = this.sndata.split(',').length;

					var tol = 0;
					//计算商品总价
					for (var i = 0; i < this.authlise.length; i++) {


						tol += this.authlise[i].price * this.snnum;

					}

					this.total = tol;
					this.modalName = 'bottomModal';

					console.log("商品总额", this.total);
				}

			},
			saveorder() {
				let that=this
				if (!this.isdj) {

					return;
				}
				this.isdj = false;

				uni.request({
					url: this.$constant.BASEURL + this.$constant.GET_REPEAT,
					method: "POST",
					data: {
						authids: JSON.stringify(this.authlise),
						sn: this.sndata,
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					complete: (res) => {
						that.modalName=''
						console.log("重复授权检查结果：",res.data)
							if (res.data.code == 0) {
								that.doRealSave()
							}else{
								uni.showModal({
									title:'提示',
									content: res.data.message,
									success(res) {
										if(res.confirm){
											console.log('用户点击确定')
											that.doRealSave()
										}else if(res.cancel){
											console.log
										}
									}
								})
							}
						}
				})

			},
			doRealSave(){
				uni.request({
					url: this.$constant.BASEURL + this.$constant.GET_SAVEORDER,
					method: "POST",
					data: {
						authids: JSON.stringify(this.authlise),
						sn: this.sndata,
						devicenum: this.snnum,
						openid: getApp().globalData.openid,
						total: this.total,
						paytype: 1,
						username: getApp().globalData.username,
						token: getApp().globalData.token,
						rec: 2,
						authorizedcompany: this.typeid
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					complete: (res) => {
						console.log(res.data)
						if (res.data.code == 0) {
							if (this.total == 0) {
								uni.redirectTo({
									url: 'delivered'
								})
							} else {
								uni.redirectTo({
									url: '../auth/settlement?jsapiau=' + JSON.stringify(res.data
										.data) + '&id=' + res.data.id
								})
							}
						} else if (res.data.code == 500) {
							uni.showToast({
								title: res.data.message,
								icon: 'none',
							})
							setTimeout(function() {
								uni.reLaunch({
									url: '/pages/login/login'
								})
							}, 2000)
						} else {
							this.mes = res.data.message;
							this.modalName = 'Modal';
						}
						this.isdj = true;
					}
				});
			},
			hideModal(e) {
				this.modalName = null

			}

		}
	}
</script>

<style>
	.leave-info {
		background-color: #FFFFFF;
		padding: 8upx 30upx;
		min-height: 100upx;
		font-size: 28upx;
	}

	.title {

		font-weight: 300;

	}

	.lab {

		background-color: #f0f0f0;

		border-radius: 20px;
		padding: 0 16px;
		font-size: 14px;
		height: 34px;

		line-height: 2.5;
		margin: 0;
		float: left;
	}
</style>